<template>
    <div>
        <div>
        <el-link type="primary" @click="modifyFlag">修改店铺</el-link>
        <el-link type="primary" style="margin-left:100px;" @click="modifyFlag2">免费开店</el-link>
        </div>
        <div style="margin-left:100px;" v-if="flag3">
            <el-row>
                <el-col :span="4">店铺名称</el-col>
                <el-col :span="6"><el-input v-model="marketName" type="text"></el-input></el-col>
            </el-row>
            <el-row>
                <el-col :span="4">店铺类型</el-col>
                <el-col :span="6"><el-input v-model="marketType" type="text"></el-input></el-col>
            </el-row>
            <el-row>
                <el-col :span="4">店铺老板</el-col>
                <el-col :span="6"><el-input v-model="marketAuthor" type="text"></el-input></el-col>
            </el-row>
            <el-row>
                <el-col :span="4">店铺邮箱</el-col>
                <el-col :span="6"><el-input v-model="marketEmail" type="text"></el-input></el-col>
            </el-row>
            <el-row>
                <el-col :span="4">店铺电话</el-col>
                <el-col :span="6"><el-input v-model="marketPhone" type="text"></el-input></el-col>
            </el-row>
            <el-row>
                <el-button type="primary" @click="manageShop">保存</el-button>
            </el-row>
        </div>
        <div style="margin-left:100px;" v-else>
            <el-row>
                <el-col :span="4">店铺名称</el-col>
                <el-col :span="6"><el-input v-model="marketName" type="text"></el-input></el-col>
            </el-row>
            <el-row>
                <el-col :span="4">店铺类型</el-col>
                <el-col :span="6"><el-input v-model="marketType" type="text"></el-input></el-col>
            </el-row>
            <el-row>
                <el-col :span="4">店铺老板</el-col>
                <el-col :span="6"><el-input v-model="marketAuthor" type="text"></el-input></el-col>
            </el-row>
            <el-row>
                <el-col :span="4">店铺邮箱</el-col>
                <el-col :span="6"><el-input v-model="marketEmail" type="text"></el-input></el-col>
            </el-row>
            <el-row>
                <el-col :span="4">店铺电话</el-col>
                <el-col :span="6"><el-input v-model="marketPhone" type="text"></el-input></el-col>
            </el-row>
            <el-row>
                <el-button type="primary" @click="addShop">开店</el-button>
            </el-row>
        </div>
    </div>
</template>
<script>
import store from '@/store/index'
export default {
    data(){
        return{
            marketName:this.$store.state.marketName,
            marketType:this.$store.state.marketType,
            marketAuthor:this.$store.state.marketAuthor,
            marketEmail:this.$store.state.marketEmail,
            marketPhone:this.$store.state.marketPhone,
            flag3:true
        }
    },
    methods:{
        modifyFlag(){
            this.flag3=true;
        },
        modifyFlag2(){
            this.flag3 = false;
        },
        manageShop(){
            if(this.marketName=="" || this.marketType=="" || this.marketAuthor=="" || this.marketEmail=="" || this.marketPhone==""){
                window.alert("请填写完整的信息");
            }else{
            let marketInfo = {
                'marketName':this.marketName,
                'marketType':this.marketType,
                'marketAuthor':this.marketAuthor,
                'marketEmail':this.marketEmail,
                'marketPhone':this.marketPhone

            };
            this.axios.post("/api/shopping/manageShop.php",marketInfo).then((res)=>{
                    if(res.data=="ok"){
                      store.dispatch('setMarketname',marketInfo.marketName);
                      store.dispatch('setMarkettype',marketInfo.marketType);
                      store.dispatch('setMarketauthor',marketInfo.marketAuthor);
                      store.dispatch('setMarketemail',marketInfo.marketEmail);
                      store.dispatch('setMarketphone',marketInfo.marketPhone);
                      window.alert("修改成功");
                    }else if(res.data=="error"){
                        window.alert("修改异常");
                    }else{
                        window.alert("数据传输失败");
                    }
            });
           }
        },
        addShop(){
            if(store.state.marketName!=""){
                window.alert("已经有了自己的小店了");
            }else if(this.marketName==""||this.marketType==""||this.marketAuthor==""||this.marketEmail==""||this.marketPhone==""){
                window.alert("请填写完整的店铺信息");
            } else{
                let shopInfo = {
                    'marketName':this.marketName,
                    'marketType':this.marketType,
                    'marketAuthor':this.marketAuthor,
                    'marketEmail':this.marketEmail,
                    'marketPhone':this.marketPhone,
                    'username':store.state.username
                };
                this.axios.post("/api/shopping/addShop.php",shopInfo).then((res)=>{
                    if(res.data=="ok"){
                        store.dispatch('setMarketname',shopInfo.marketName);
                        store.dispatch('setMarkettype',shopInfo.marketType);
                        store.dispatch('setMarketauthor',shopInfo.marketAuthor);
                        store.dispatch('setMarketemail',shopInfo.marketEmail);
                        store.dispatch('setMarketphone',shopInfo.marketPhone);
                        window.alert("开店成功");
                    }else if(res.data=="notLogin"){
                        this.$router.push('/login');
                    }else{
                        window.alert("系统繁忙，请稍后重试");
                    }
                });
            }
        }
    }
}
</script>
<style>
    el-row{
        margin-top: 50px;
        margin-bottom: 20px;
    }
</style>